<template>
	<view class="padding-30">
		<view class="padding-30 bg-fff border-radius20 flex-between margin-bottom30" v-for="(item,index) in list" :key="index"
		@click="choosePatlient(item)">
			<view class="flex1">
				<view class="flex-alignItems-center margin-bottom20">
					<view class="fontSize-15 color-000 fontWeight-bold margin-right10">{{item.name}}</view>
					<view class="btn1 flex-center margin-right10">{{item.relation}}</view>
					<view class="fontSize-15 color-000 margin-right10">{{item.gender}}</view>
					<view class="fontSize-15 color-000 margin-right10">{{item.age}}岁</view>
					<view class="btn2 flex-center" v-if="item.is_default == 1">默认</view>
				</view>
				<view class="fontSize-15 color-000">证件号: {{item.card}}</view>
			</view>
			<view class="flex-alignItems-center">
				<view class="margin-right20" @click.stop="editPatientList(item.id)">
					<u-icon name="edit-pen" color="#333333" size="25"></u-icon>
				</view>
				<view @click.stop="deletePatientList(item.id)">
					<u-icon name="trash" color="#333333" size="25"></u-icon>
				</view>
			</view>
		</view>
		
		<u-empty v-if="list.length == 0" mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png"
			width="150px" height="150px" text="列表为空" textSize="18">
		</u-empty>

		<!-- 底部操作栏 -->
		<view style="height: 200rpx;"></view>
		<view class="position-fixed-bottom padding-30 bg-fff" @click="$tools.navigateTo('/pages/index/add-patient')">
			<view class="btn50-0165FD-15ffffff flex-center">
				添加就诊人
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				list: []
			}
		},
		onShow() {
			this.sickList()
		},
		methods:{
			// 切换就诊人
			choosePatlient(item){
				uni.setStorageSync('patlient-item',item)
				this.$tools.navigateBack()
			},
			// 编辑就诊人
			editPatientList(id){
				this.$tools.navigateTo('/pages/index/add-patient?id='+id)
			},
			// 删除就诊人
			deletePatientList(id){
				let that = this
				uni.showModal({
					title: '提示',
					content: '是否删除该就诊人',
					success: function (res) {
						if (res.confirm) {
							that.$http.post(that.$api.sick_del,{id:id}).then(res=>{
								if (res.code == 1) {
									uni.showToast({
										title: '删除成功',
										icon: 'none'
									})
									that.sickList()
								}
							})
						} else if (res.cancel) {
							uni.showToast({
								title: '取消删除',
								icon: 'none'
							})
						}
					}
				});
			},
			// 就诊人列表
			async sickList() {
				let res = await this.$http.post(this.$api.sick_list, {}, {
					token: true
				})
				this.list = res.data.map(item=>{
					return {
						id:item.id,
						name:item.name,
						relation:item.relation,
						gender:item.gender==1?'男':'女',
						age:item.age,
						is_default:item.is_default,
						card:item.card.replace(/(\w{2})\w*(\w{2})/, '$1**************$2')
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.btn2{
		padding: 5rpx 10rpx;
		border: 1px solid #FF7070;
		font-weight: 400;
		font-size: 12px;
		color: #FF7070;
		border-radius: 4rpx 4rpx 4rpx 4rpx;
	}
	.btn1{
		padding: 5rpx 10rpx;
		// min-width: 10rpx;
		background: #F7BB57;
		font-weight: 400;
		font-size: 12px;
		color: #FFFFFF;
		border-radius: 4rpx 4rpx 4rpx 4rpx;
	}
</style>